<template>
    <div class="swiper-container">
        <div class="swiper-wrapper">
            <slot name="banner"></slot>
        </div>
    </div>
</template>
<script src="@/dist/js/swiper.js"></script>
  <script>
  // import HelloWorld from '@/components/HelloWorld.vue'
  import Swiper from "@/dist/js/swiper"
  export default {
    name: "banner",
    data() {
      return {
        
      }
    },
    methods: {
  
    },
    components: {
        // Swiper
    },
    mounted() {
      var mySwiper = new Swiper ('.swiper-container', {
        direction: 'vertical', // 垂直切换选项
        loop: true, // 循环模式选项
        autoplay:true,
        effect:'fade'
    })       
},
}
  </script>
  <style src="@/dist/css/swiper.min.css"></style>
<style>
/* @import'@/dist/css/swiper.css'; */
  .swiper-container {
      width: 890px;
      height: 332px;
  } 
  .swiper-container img{
     width: 890px;
     height: 332px;
  }
</style>
  